//引入axios的核心库
import axios, { AxiosInstance, AxiosRequestConfig, AxiosResponse } from 'axios'
import qsString from 'querystring'
//引入封装好的接口
import { ResultDate } from './interface'
import { ElMessage } from 'element-plus'
import { useRouter } from 'vue-router';
let router = useRouter()

/* 
    axios.create({
        //包含了所有配置
        timeout
        baseURL
    })
*/
//定义axios实例的配置对象，定义的内容 必须跟实例的要求一致

let config = {
    baseURL: '/api'
}

//通过类去进行拦截器以及交互方法的封装
//定义了一个请求类
class HttpRequest {
    http: AxiosInstance
    //类的作用域 省略了声明方式
    constructor(config: AxiosRequestConfig) {
        //构造器 初始化内容 this
        //重新创建一个axios实例 把这个实例赋值给这个属性
        this.http = axios.create(config)
        //初始化请求拦截器
        this.http.interceptors.request.use(req =>{
            let data = sessionStorage.getItem('userinfo')
            let token = data?JSON.parse(data).token:''
            req.headers.authorization = token
            return req
        })
        //初始化响应拦截器
        this.http.interceptors.response.use((res: AxiosResponse) =>{
            if(res.data.code == 403){
                ElMessage.warning(res.data.msg)
                router.push('/login')
            }   
            return res.data
        })
    }
    //get 方法 url params 
    get<T>(url: string, params?: object): Promise<ResultDate<T>> {
        return this.http.get(url, { params })
    }
    //post 方法
    post<T>(url: string, params?: any, isFile: boolean = false): Promise<ResultDate<T>> {
        let data: any = {}
        if (isFile) {
            data = new FormData()
            for (const [i, value] of Object.entries(params)) {
                data.append(i, value)
            }
        } else {
            data = qsString.stringify(params)
        }
        return this.http.post(url, data)
    }
}

//导出实例化结果
export default new HttpRequest(config)